<template>
  <div class="topOperation">
    <span class="returnBack" @click="backgo"><i class="icon-retrun"></i></span>
    <div v-if="title" class="sreach-header">
      {{ title }}
    </div>
    <div v-if="showSreach" class="sreach-box">
      <el-input
        v-model="sreachval"
        placeholder="请输入内容"
        clearable
        @focus="focusSreach(sreachval)"
        @input="changeSreach(sreachval)"
      >
      </el-input>
    </div>
  </div>
</template>
<script type="text/javascript">
export default {
  props: {
    title: {
      type: String,
      default: ''
    },
    showSreach: {
      type: Boolean,
      default: false
    },
    canJump: {
      type: Boolean,
      default: false
    },
    canSreach: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      sreachval: ''
    }
  },
  mounted() {
    // console.log(this.title, this.showSreach)
  },
  methods: {
    backgo() {
      this.$router.go(-1)// 返回上一层
    },
    focusSreach(val) {
      if (this.canJump) {
        this.$router.push({ path: '/preciseSearch' })
      }
    },
    changeSreach(val) {
      if (this.canSreach) {
        this.$store.commit('updateSreach', this.sreachval)
      }
    }
  }
}
</script>
<style>
.el-input__inner {
  border-width:1px;/*no*/
}
</style>
